<script setup>
import {reactive} from "vue";

let person = reactive({
  name: "abcque",
  gender: "M",
  age: 20
})


</script>

<template>
  <ul>
    <li v-for="item in person">{{ item }}</li>
  </ul>

  <ul>
    <li v-for="(value, key) in person">{{ key }}: {{ value }}</li>
  </ul>

  <ul>
    <li v-for="(value, key, index) in person">{{ index+1 }} - {{ key }}: {{ value }}</li>
  </ul>
</template>

<style scoped>

</style>